<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>学生页</title>
  <link rel="stylesheet" type="text/css" href="/themes/default/easyui.css">
  <link rel="stylesheet" type="text/css" href="/themes/icon.css">
  <script type="text/javascript" src="/jquery.min.js"></script>
  <script type="text/javascript" src="/jquery.easyui.min.js"></script>
  <script type="text/javascript" src="/locale/easyui-lang-zh_CN.js"></script>

  <script type="text/javascript">
    $(function () {
      $.messager.alert("提示","欢迎使用js");
    });
  </script>

  <style type="text/css">
    table
    {
      border-collapse: collapse;
      margin: 0 auto;
      text-align: center;
    }
    table td, table th
    {
      border: 1px solid #cad9ea;
      color: #666;
      height: 30px;
    }
    table thead th
    {
      background-color: #CCE8EB;
      width: 100px;
    }
    table tr:nth-child(odd)
    {
      background: #fff;
    }
    table tr:nth-child(even)
    {
      background: #F5FAFA;
    }
  </style>

</head>
<body>
<h1>EasyUI</h1>
<div>
  <table>
    <tr>
      <td field="id">学生编号</td>
      <td field="name">学生姓名</td>
      <td field="age">学生年龄</td>
      <td field="clazzid">学生所属班级</td>
    </tr>
    <tr th:each="student : ${studentList.data}">
      <td><em th:text="${student.id}"></em></td>
      <td><em th:text="${student.name}"></em></td>
      <td><em th:text="${student.age}"></em></td>
      <td><em th:text="${student.clazzid}"></em>班</td>
    </tr>
  </table>
</div>
</body>
</html>